<template>
  <div class="main">
    <div>
      <div class="title">客户编号</div>
      <div class="value">{{ userInfo.code }}</div>
    </div>
    <div>
      <div class="title">客户名称</div>
      <div class="value">{{ userInfo.name }}</div>
    </div>
    <div>
      <div class="title">客户地址</div>
      <div class="value">{{ userInfo.address }}</div>
    </div>
    <div>
      <div class="title">电话</div>
      <div class="value">{{ userInfo.phone }}</div>
    </div>
    <div>
      <div class="title">联系人</div>
      <div class="value">{{ userInfo.contact }}</div>
    </div>
    <div>
      <div class="title">exp-标识</div>
      <div class="value">{{ userInfo.exp_code }}</div>
    </div>
    <div>
      <div class="title">邮箱</div>
      <div class="value">{{ userInfo.mail }}</div>
    </div>
    <div>
      <div class="title">创建日期</div>
      <div class="value">{{ userInfo.date }}</div>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    userInfo: Object,
  },
  data() {
    return {
      info: {
        code: 1068,
        name: "广州气站",
        address: "上海市普陀区金沙江路 1518 弄",
        phone: "",
        contact: "",
        exp_code: "",
        mail: "",
        date: "2016-05-02",
      },
    };
  },
};
</script>

<style scoped>
.main {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  align-content: space-between
}
.main > div {
  flex: 0 0 200px;
}
.title {
  color: gray;
}
</style>